Кужелев Евгений by askeip · Pull Request #45 · urfu-2016/markup-task-4

askeip · 2016-10-31T11:29:57Z

Посмотреть решение

honest-hrundel · 2016-10-31T11:31:00Z

🍅 Не пройден линтинг или базовые тесты

honest-hrundel · 2016-10-31T11:46:46Z

🍅 Не пройден линтинг или базовые тесты

honest-hrundel · 2016-10-31T13:00:23Z

🍅 Не пройден линтинг или базовые тесты

honest-hrundel · 2016-10-31T16:48:46Z

🍅 Не пройден линтинг или базовые тесты

honest-hrundel · 2016-10-31T16:56:24Z

🍅 Не пройден линтинг или базовые тесты

honest-hrundel · 2016-10-31T16:58:02Z

🍅 Не пройден линтинг или базовые тесты

honest-hrundel · 2016-10-31T17:02:03Z

🍅 Не пройден линтинг или базовые тесты

honest-hrundel · 2016-10-31T17:05:40Z

🍅 Не пройден линтинг или базовые тесты

honest-hrundel · 2016-10-31T17:09:14Z

🍏 Пройден линтинг и базовые тесты

honest-hrundel · 2016-11-02T11:02:51Z

🍏 Пройден линтинг и базовые тесты

VasiliiKuznecov · 2016-11-03T19:14:14Z

В firefox статья слева залезает в центральную колонку

VasiliiKuznecov · 2016-11-03T19:15:59Z

index.css

+    margin: 0 1%;
+}
+
+thead


лучше не использовать в селекторах названия тегов, так как на странице может быть несколько таких тегов, которые должны отображаться по-разному. А получаетсся, что будут отображаться одинаково. Лучше использовать классы

к верхнему посту. я так понял, что суть в том, что если браузер не поддерживает операции с колонками, то на это стоит забить, вместо переделывания верстки

теги стоит совсем убрать или селекторы типа .class tag можно использовать?

такие в общем то можно

VasiliiKuznecov · 2016-11-03T19:16:38Z

index.css

+    break-inside: avoid;
+}
+
+.col3


лучше не сокращать

VasiliiKuznecov · 2016-11-03T19:16:55Z

index.css

+    font-size: .8rem;
+}
+
+.imgblock


img-block

VasiliiKuznecov · 2016-11-03T19:17:43Z

index.html

+    </div>
+</header>
+<hr>
+<div class="main">


тег main?

VasiliiKuznecov · 2016-11-03T19:18:40Z

index.html

+</header>
+<hr>
+<div class="main">
+    <div class="article">


тег section
класс лучше назвать по-другому, чтобы не запутаться в тегах и классах, а то называются одинаково

honest-hrundel · 2016-11-04T13:35:12Z

🍏 Пройден линтинг и базовые тесты

askeip · 2016-11-04T13:39:15Z

Поэкспериментировав со свойством column-fill пришел к выводу, что перенос статьи в другую колонку это лучшее решение в firefox, значении auto становится только хуже

askeip · 2016-11-04T13:40:40Z

🍏

honest-hrundel · 2016-11-05T09:41:17Z

🍅 Не пройден линтинг или базовые тесты

honest-hrundel · 2016-11-05T10:41:24Z

🍏 Пройден линтинг и базовые тесты

VasiliiKuznecov · 2016-11-07T16:59:06Z

index.css

+    margin: 15px 0;
+}
+
+.column-3


Лучше называть более понятно, например, three-columns-text

VasiliiKuznecov · 2016-11-07T16:59:40Z

index.css

+    font-size: 1.5rem;
+}
+
+.l


непонятное название класса

это имя персонажа, оно всегда таким шрифтом было. ну не суть

Я читал мангу, смотрел аниме и экранизацию, но название класса осуждаю. Переименовать.

VasiliiKuznecov · 2016-11-07T17:00:06Z

🚀

honest-hrundel · 2016-11-07T17:11:39Z

🍏 Пройден линтинг и базовые тесты

steppefox

🍅

steppefox · 2016-11-08T18:33:59Z

index.css

+@font-face
+{
+    font-family: Cloister Black;
+    src: url(cloisterblack-webfont.woff2)


Пожалуйста, выровняй format на линии с url к которому он относится. Если тебя беспокоит линтер по поводу запятых, запятые можешь оставить на той же линии где они находятся сейчас. Так же добавь пожалуйста к шрифтам директиву local.

steppefox · 2016-11-08T18:34:29Z

index.css

+html
+{
+    font-size: 16px;
+    margin: 0 1%;


Вот это нужно убрать

не понял в чем конкретно проблема здесь. все размеры шрифтов у меня заданы через rem, значит мне нужно задать font-size у html. margin могу перенести в body, без него появляется горизонтальная полоса прокрутки

steppefox · 2016-11-08T18:35:15Z

index.css

+
+.head
+{
+    width: 100%;


Элемент header по умолчанию блочный, зачем ему указывать такую ширину?

steppefox · 2016-11-08T18:37:09Z

index.css

+.head div,
+.head h1
+{
+    display: inline-block;


Зачем делать info и subinfo - display: inline-block, если визуально они выглядят как блочные и им еще руками приходится задавать ширину?

steppefox · 2016-11-08T18:37:50Z

index.css

+.head h1
+{
+    display: inline-block;
+    margin-bottom: 1%;


Вертикальные процентные margin очень редкая практика - и это явно не нужно в твоем случае

steppefox · 2016-11-08T18:50:37Z

index.html

+                Tim Miller has vacated the director’s chair on Deadpool 2,
+                it seems that 20th Century Fox is wasting little time in securing a replacement.</p>
+            <div class="img-block">
+                <img src="david_leitch.jpg" alt="david leitch">


alt слишком короткий и написан не корректно (имена пишутся с заглавных букв). Пожалуйста, дай более полное описание картинке. Обязательно нужно выставлять аттрибуты width и height изображениям. А так же заполнять title (можно продублировать из alt)

steppefox · 2016-11-08T18:51:39Z

index.html

+        <h3>Death Note (2017 film) info</h3>
+        <div class="img-block height400">
+            <img src="l.jpg" alt="l">
+            <p>I am <span class="l">L</span>, motherfucker</p>


Плохой класс, переименовать

steppefox · 2016-11-08T18:53:08Z

index.html

+    <section>
+        <h3>Death Note (2017 film) info</h3>
+        <div class="img-block height400">
+            <img src="l.jpg" alt="l">


Опять таки, плохой alt, нужно добавить width, height, title. Исходник картинки больше необходимого по ширине в два раза, нужно выводить исходные изображения того размера, какого они будут в верстке.

Я не понял, что нужно сделать с width и height. Webstorm по умолчанию вставляет размеры изображения в эти параметры, какого размера должна быть картинка в итоге я знать не могу, до того как узнаю ширину колонки. Что от меня требуется?

Сорри, запутал тебя. Для фиксированных размером картинок width/height обязателен в аттрибутах. Для резиновых нет.

steppefox · 2016-11-08T18:54:20Z

index.html

+        <div class="weather">
+            <h4>NY Weather</h4>
+            <p>
+                SUN OCT 30 Partly cloudy in the morning. Increasing clouds


Слишком мелкий текст

steppefox · 2016-11-08T18:55:17Z

index.html

+            </p>
+        </div>
+        <h1>Cinema News</h1>
+        <div class="rate">


Цифры и буквы прилипают к границам

honest-hrundel · 2016-11-09T10:19:47Z

🍏 Пройден линтинг и базовые тесты

askeip · 2016-11-09T10:20:02Z

🍏

steppefox

🍅

steppefox · 2016-11-10T11:33:43Z

index.css

+
+body
+{
+    margin: 0 1%;


Ну зачем здесь этот несчастный 1%?) Укажи какое-нибудь фиксированное число в px. Кстати текст снизу сильно прижат к краю экрана.

steppefox · 2016-11-10T11:34:56Z

index.html

+    <section>
+        <h3>Death Note (2017 film) info</h3>
+        <div class="img-block">
+            <img width="807" height="627" src="l.jpg" alt="Death Note Netflix mem"


Исходное изображение больше необходимого (даже для экрана 1920px)

steppefox · 2016-11-10T11:36:14Z

Еще нужен пример вертикального текста

honest-hrundel · 2016-11-10T12:23:05Z

🍅 Не пройден линтинг или базовые тесты

honest-hrundel · 2016-11-10T13:37:53Z

🍏 Пройден линтинг и базовые тесты

steppefox

🍅

steppefox · 2016-11-11T11:38:51Z

index.css

+
+.vertical-text
+{
+    float: left;


Нельзя

steppefox · 2016-11-11T11:39:55Z

index.css

+    text-align: center;
+    text-transform: uppercase;
+    word-wrap: break-word;
+    width: 1ch;


Очень редкая единица размера. Может лучше em?

steppefox · 2016-11-11T11:40:48Z

Едет на широком экране

steppefox · 2016-11-11T11:41:20Z

Also, я не против rem, но в рамках этого задания попрактикуйся пожалуйста с em. Тоесть все rem заменить на em

honest-hrundel · 2016-12-12T09:51:13Z

🍏 Пройден линтинг и базовые тесты

paper created

4ef5910

lint fixes

a814902

askeip added 4 commits October 31, 2016 16:47

spaces

e9f1ed9

spaces

8271c18

spaces fight webstorm

921bdf5

ultrakludge added (wow)

2977dbe

spaces fix

2aeb80d

thead fix

ba34064

lang en

72b731b

$ fix

e445b58

& fix

8341516

spaces before </ fix

84d427c

honest-hrundel assigned VasiliiKuznecov Oct 31, 2016

-float, +inline-block (firefox still bad)

d797a30

VasiliiKuznecov reviewed Nov 3, 2016

View reviewed changes

index.css Outdated

break-inside: avoid;

}

.col3

Copy link

VasiliiKuznecov Nov 3, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

лучше не сокращать

VasiliiKuznecov reviewed Nov 3, 2016

View reviewed changes

index.css Outdated

font-size: .8rem;

}

.imgblock

Copy link

VasiliiKuznecov Nov 3, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

img-block

VasiliiKuznecov reviewed Nov 3, 2016

View reviewed changes

index.html Outdated

</div>

</header>

<hr>

<div class="main">

Copy link

VasiliiKuznecov Nov 3, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

тег main?

VasiliiKuznecov reviewed Nov 3, 2016

View reviewed changes

paper looks same in google/mozilla

a58508c

askeip added 2 commits November 5, 2016 14:44

lint fixed

7542873

hru wakeup

bc73b19

VasiliiKuznecov reviewed Nov 7, 2016

View reviewed changes

honest-hrundel assigned steppefox and unassigned VasiliiKuznecov Nov 7, 2016

column-3 => three-columns-text

615a226

steppefox requested changes Nov 8, 2016

View reviewed changes

mentor's comments fixed

2a22b87

steppefox requested changes Nov 10, 2016

View reviewed changes

verticle-text added

5f30c70

lint fixed

f80a727

steppefox requested changes Nov 11, 2016

View reviewed changes

refactored

5b43811

Comments

Conversation

askeip commented Oct 31, 2016 • edited by honest-hrundel Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

honest-hrundel commented Oct 31, 2016

Uh oh!

honest-hrundel commented Oct 31, 2016

Uh oh!

honest-hrundel commented Oct 31, 2016

Uh oh!

honest-hrundel commented Oct 31, 2016

Uh oh!

honest-hrundel commented Oct 31, 2016

Uh oh!

honest-hrundel commented Oct 31, 2016

Uh oh!

honest-hrundel commented Oct 31, 2016

Uh oh!

honest-hrundel commented Oct 31, 2016

Uh oh!

honest-hrundel commented Oct 31, 2016

Uh oh!

honest-hrundel commented Nov 2, 2016

Uh oh!

VasiliiKuznecov commented Nov 3, 2016

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

honest-hrundel commented Nov 4, 2016

Uh oh!

askeip commented Nov 4, 2016

Uh oh!

askeip commented Nov 4, 2016

Uh oh!

honest-hrundel commented Nov 5, 2016

Uh oh!

honest-hrundel commented Nov 5, 2016

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

VasiliiKuznecov commented Nov 7, 2016

Uh oh!

honest-hrundel commented Nov 7, 2016

Uh oh!

steppefox left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

askeip commented Oct 31, 2016 •

edited by honest-hrundel

Loading